<template>
  <div class="course-grade">
    <!-- 课程列表 -->
    <TrainingBox :title="$t('content.profile.exam.course_title')">
      <TableVue
        :data="courseList"
        :columns="examCourseColumns"
        operate="none"
      />
    </TrainingBox>
    <!-- 成绩展示 -->
    <TrainingBox :title="$t('content.profile.exam.score_title')">
      <ScoreList :data="courseScoreList" />
    </TrainingBox>
    <!-- <div class="divider-line"></div> -->
    <!-- 补考 -->
    <!-- <TrainingBox :title="$t('content.profile.exam.exam_title')">
      <ScoreList :data="buCourseScoreList" />
    </TrainingBox> -->
  </div>
</template>

<script setup lang="ts">
import { ref, watch } from "vue";
import {
  postCourseSubmitList,
  postCourseSubmitScoreList,
} from "../../../../../../api/aviation";
import type { CourseSubmitListItem } from "../../../../../../types/aviation";
import { examCourseColumns } from "../../../a_data/table";
import TrainingBox from "../TrainingBox.vue";
import TableVue from "../../../a_components/table.vue";
import ScoreList from "../../../a_components/scoreList.vue";
type Props = {
  course_id: number | string;
  course_ku_id: number | string;
};
const props = defineProps<Props>();
let params = {
  course_id: props.course_id,
  course_ku_id: props.course_ku_id,
};

// 课程列表数据
const courseList = ref();
const getCourseSubmitListData = async () => {
  let res = await postCourseSubmitList(params);
  if (res.code === 200) {
    courseList.value = res.data.map((item) => {
      return {
        id: item.id,
        course_title: item.list_title,
        class_time: item.start_time,
        exam_time: item.middle_time,
        review_time: item.end_time,
        address: item.course_address_title,
      };
    });
  }
};

// 课程列表成绩数据
const courseScoreList = ref<Object>();
const buCourseScoreList = ref();
const materialList = ref();
const getCourseSubmitCoreList = async () => {
  let res = await postCourseSubmitScoreList(params);

  if (res.code === 200) {
    courseScoreList.value = res.data;
    let new_make_data: any = {};
    let make_data = res.make_data;
    if (make_data) {
      let make_arrs = Object.keys(make_data);
      make_arrs.map((key) => {
        let value = make_data[key];
        if (value != -100) {
          new_make_data[key] = value;
        }
      });
    }
    buCourseScoreList.value = new_make_data;
    materialList.value = res.material;
  }
};

const getAllData = () => {
  if (props.course_id && props.course_ku_id) {
    getCourseSubmitListData();
    getCourseSubmitCoreList();
  }
};
getAllData();

watch([() => props.course_id, () => props.course_ku_id], (newValue) => {
  getAllData();
});
</script>
<style scoped lang="less">
.divider-line {
  margin: 24px 0;
}
.course-grade > *:first-child {
  margin-bottom: 24px;
}
</style>
